import { List, InputItem, WhiteSpace, WingBlank, Picker } from 'antd-mobile';
import { createForm } from 'rc-form';

const Item = List.Item;
const Brief = Item.Brief;


class Label extends React.Component {
  render() {
    return (
      <div>
        <List className="my-list">
          <Item multipleLine extra={<div data-index={ this.props.index } class="am-list-extra" onClick={this.props.deleteClick}>删除</div>} >
            { this.props.language } <span>{ this.props.score }</span>
          </Item>
        </List>
        <input name={ this.props.nameL } value={ this.props.language } type='hidden'/>
        <input name={ this.props.nameS } value={ this.props.score } type='hidden'/>
        <WhiteSpace />
      </div>
    )
  }
}

class App extends React.Component {

  constructor(props) {
      super(props);

      this.state = {
        wgy1: props.record.wgy1 ? [props.record.wgy1] : ['1'],
        wgy2: props.record.wgy2 ? [props.record.wgy2] : ['1'],
      };
  }

  // handClick = () =>{
  //   const language = this.props.form.getFieldValue("language"),
  //         score = this.props.form.getFieldValue("score")

  //   if( !language || !score ){
  //     offline();
  //     return false;
  //   }

  //   this.setState({
  //     language: this.state.language.concat(language),
  //     score: this.state.score.concat(score),
  //     node: this.state.node.concat(Label)
  //   },function(){
  //     this.props.form.resetFields()
  //   })
  // }

  // deleteClick = (event) =>{
  //   const index = parseInt(event.target.getAttribute( "data-index" )),
  //         language = this.state.language,
  //         score = this.state.score,
  //         node = this.state.node

  //   language.splice(index,1)
  //   score.splice(index,1)
  //   node.splice(index,1)

  //   this.setState({
  //     language: language,
  //     score: score,
  //     node: node
  //   })
  // }

  render() {
    const name = this.props.nodeName;
    const { getFieldProps } = this.props.form;
    const Languages1 = [
    {value:'1',label:'大学英语四级'},
    {value:'2',label:'大学英语六级'},
    {value:'3',label:'专业四级'},
    {value:'4',label:'专业八级'},
    {value: '0', label: '其他'}];

    const Languages2 = [
    {value:'1',label:'雅思'},
    {value:'2',label:'托福'},
    {value:'3',label:'GRE'}];

    return (
      <div className={name}>
        <h2 className="step-title">{this.props.title}</h2>

        {/* <List>
          <Picker
          data={Languages1}
          cols={1}
          onChange = { v => this.setState(Object.assign({}, this.state, { wgy1: v })) }
          value={ this.state.wgy1 }
          className="forss"
          >
            <List.Item arrow="horizontal">英语成绩类型</List.Item>
          </Picker>
          <input type="hidden" value={ this.state.wgy1 } name="wgy1"></input>
        </List>
        {this.state.wgy1[0] != '0' ? (
        <List>
          <InputItem
            placeholder=""
            name='wgy1cj'
            defaultValue={this.props.record.wgy1cj}
            type="digit"
          >成绩</InputItem>
        </List>) : null}
        <WhiteSpace />

        {this.state.wgy1[0] == '0' ? (
        <List>
          <Picker
          data={Languages2}
          cols={1}
          onChange = { v => this.setState(Object.assign({}, this.state, { wgy2: v })) }
          value={ this.state.wgy2 }
          className="forss"
          >
            <List.Item arrow="horizontal">考试类型</List.Item>
          </Picker>
          <input type="hidden" value={ this.state.wgy2 } name="wgy2"></input>
        </List>) : null}

        {this.state.wgy1[0] == '0' ? (
        <List>
          <InputItem
            placeholder=""
            name='wgy2cj'
            defaultValue={this.props.record.wgy2cj}
            type="digit"
          >成绩</InputItem>
        </List>) : null}

        {this.state.wgy1[0] == '0' ? <WhiteSpace /> : null}

        <List>
          <InputItem
            placeholder=""
            name='wgy3'
            defaultValue={this.props.record.wgy3}
          >非英语语种</InputItem>
        </List>
        <List>
          <InputItem
            placeholder=""
            name='wgy3cj'
            type="digit"
            defaultValue={this.props.record.wgy3cj}
          >成绩</InputItem>
        </List>
        <WhiteSpace /> */}

        <List>
          <InputItem
            placeholder=""
            name='cet4'
            defaultValue={this.props.record.cet4 > 0 ? this.props.record.cet4 : ''}
            extra="CET4"
          >四级</InputItem>
          <InputItem
            placeholder=""
            name='cet6'
            defaultValue={this.props.record.cet6 > 0 ? this.props.record.cet6 : ''}
            extra="CET6"
          >六级</InputItem>
          <InputItem
            placeholder=""
            name='gmat'
            defaultValue={this.props.record.gmat > 0 ? this.props.record.gmat : ''}
          >GMAT</InputItem>
          <InputItem
            placeholder=""
            name='toefl'
            defaultValue={this.props.record.toefl > 0 ? this.props.record.toefl : ''}
          >TOEFL</InputItem>
          <InputItem
            placeholder=""
            name='ielts'
            defaultValue={this.props.record.ielts > 0 ? this.props.record.ielts : ''}
          >IELTS</InputItem>
          <InputItem
            placeholder=""
            name='gre'
            defaultValue={this.props.record.gre > 0 ? this.props.record.gre : ''}
          >GRE</InputItem>
          <InputItem
            placeholder=""
            name='pro4'
            defaultValue={this.props.record.pro4 > 0 ? this.props.record.pro4 : ''}
          >专四</InputItem>
          <InputItem
            placeholder=""
            name='pro8'
            defaultValue={this.props.record.pro8 > 0 ? this.props.record.pro8 : ''}
          >专八</InputItem>
        </List>
        <WhiteSpace />

      </div>
    );
  }
}

const Step7 = createForm()(App);

export default Step7
